/* styles/global.css */
:root {
  --primary-color: #409eff;
  --success-color: #67c23a;
  --warning-color: #e6a23c;
  --danger-color: #f56c6c;

  --color-primary-light-3: #79bbff;
  --color-primary-light-5: #a0cfff;
  --color-primary-light-7: #c6e2ff;
  --color-primary-light-8: #d9ecff;
  --color-primary-light-9: #ecf5ff;
  --color-primary-dark-2: #337ecc;

  --color-success-light-3: #95d475;
  --color-success-light-5: #b3e19d;
  --color-success-light-7: #d1edc4;
  --color-success-light-8: #e1f3d8;
  --color-success-light-9: #f0f9eb;
  --color-success-dark-2: #529b2e;

  --color-warning-light-3: #eebe77;
  --color-warning-light-5: #f3d19e;
  --color-warning-light-7: #f8e3c5;
  --color-warning-light-8: #faecd8;
  --color-warning-light-9: #fdf6ec;
  --color-warning-dark-2: #b88230;

  --color-danger-light-3: #f89898;
  --color-danger-light-5: #fab6b6;
  --color-danger-light-7: #fcd3d3;
  --color-danger-light-8: #fde2e2;
  --color-danger-light-9: #fef0f0;
  --color-danger-dark-2: #c45656;

  --color-error-dark-2: #c45656;
  --color-info-light-5: #c8c9cc;
  --color-info-light-7: #dedfe0;
  --color-info-light-8: #e9e9eb;
  --color-info-dark-2: #73767a;

  --primary-text-color: #303133;
  --regular-ext-color: #606266;
  --secondary-text-color: #909399;
  --placeholder-ext-color: #a8abb2;
  --disabled-text-color: #c0c4cc;

  --darker-border-color: #cdd0d6;
  --dark-border-color: #d4d7de;
  --base-border-color: #dcdfe6;
  --light-border-color: #e4e7ed;
  --lighter-border-color: #ebeef5;
  --extra-light-border-color: #f2f6fc;

  --darker-fill-color: #e6e8eb;
  --dark-fill-color: #ebedf0;
  --base-fill-color: #f0f2f5;
  --light-fill-color: #f5f7fa;
  --lighter-fill-color: #fafafa;
  --extra-light-fill-color: #fafcff;
  --blank-fill-color: #ffffff;

  --basic-black-color: #000000;
  --basic-white-color: #ffffff;
  --transparent-color: Transparent;
  --page-background-color: #f2f3f5;
  --base-background-color: #ffffff;
  --overlay-background-color: #ffffff;
}

h1 {
  color: var(--primary-color);
}

p {
  color: var(--secondary-color);
}
